const headerEle = document.getElementById('header')
const titleEle = document.getElementById('title')
const excerptEle = document.getElementById('excerpt')
const imgEle = document.getElementById('img')
const nameEle = document.getElementById('name')
const dateEle = document.getElementById('date')

const animatedBg = document.querySelectorAll('.animated-bg')
const animatedBgText = document.querySelectorAll('.animated-text')
setTimeout(getData, 5000) 
function getData() {
    headerEle.innerHTML = '<img src="https://images.unsplash.com/photo-1496181133206-80ce9b88a853?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2102&q=80" alt="" />'
    titleEle.innerHTML = 'Lorem ipsum dolor sit amet'
    excerptEle.innerHTML = 'Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore perferendis'
    imgEle.innerHTML = '<img src="https://randomuser.me/api/portraits/men/45.jpg" alt="" />'
    nameEle.innerHTML = 'John Doe'
    dateEle.innerHTML = 'Oct 08, 2020'

    animatedBg.forEach(item => {
        item.classList.remove('animated-bg')
    })
    animatedBgText.forEach(item => {
        item.classList.remove('animated-text')
    })
}